<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
    <script src="lib/js/vue.js" type="text/javascript" charset="utf-8"></script>


</head>
<body>
<div id="app">
    <input type="button" value="获取元素" @click="getElement" ref="btn">

    <h1 id="my" ref="my">哈哈哈， 今天天气真好!!!</h1>
    <hr>

    <zujian ref="zujian"></zujian>

</div>
<script>

    var login = {
        template:'<h1>登录组件</h1>',
        data() {
            return {
                msg:'son msg'
            }
        },
        methods: {
            show() {
                alert('qwe')
            }
        }
    }
    // 创建一个vue实例
    var vm = new Vue({
        el:'#app',
        data:{
            msg:'信息'
        },
        methods:{
            getElement() {
//             console.log(document.getElementById(my).innerText)
                console.log(this.$refs.my.innerText)
                this.$refs.zujian.show()
            }
        },
        components:{
            zujian:login
        }
    })
</script>
</body>
</html>
